import Taro, {Component} from '@tarojs/taro'
import {View,  Button, Picker} from '@tarojs/components'
import { AtInput, AtTextarea} from 'taro-ui'


import CustomRadio from '../../component/CustomRadio/customRadio'

import DataManager from '../../utils/DataManager.js'

import './driverPost.scss'

let isCommitEnable = true;
export default class PostPage extends Component {

  config = {
    navigationBarTitleText: '人找车'
  }

  constructor(props) {
    super(props)

    this.releaseTimes = 0;
    this.type = 0
    this.state = {
      userName: '', peopleCount: '',
      startAddress: '', tagAddress: '', startDate: '', startTime: '',
      mobile: '', intro: '', agree: true, type: this.type, submit: true,
       btnText: '发布'
    }
  }

  onPullDownRefresh(){
    Taro.stopPullDownRefresh();
  }

  componentDidMount() {

    this.setState({
      mobile : DataManager.getMobile()
    })

    this.auth = DataManager.getAuthInfo();
    let data = {platform: 'android_c', loginChannel: 'c', digest: DataManager.getAuthInfo().digest, type: this.type,};
    Object.assign(data, this.auth);

    let thiz = this
    Taro.request({
      url: 'https://www.vpin.top/a/stateless/car/userReleaseCount',
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: 'GET',
      dataType: 'json',
      data: data,
      success: (obj) => {
        let reps = obj.data
        thiz.releaseTimes = reps.data
        if (thiz.releaseTimes == 0) {
          thiz.setState({submit: thiz.releaseTimes == 0, btnText: '今日发布次数已用完'})
        } else {
          thiz.setState({submit: thiz.releaseTimes == 0})
        }

      },
      fail: (obj) => {
        Taro.showToast({
          title: '程序异常',
          icon: 'none',
          duration: 1000
        })

      }
    })


  }

  handleReturnClick() {
    Taro.navigateTo({url: '/pages/car/carList'})
  }

  handleFromChange(value) {
    this.setState({startAddress: value})
  }

  handleToChange(value) {
    this.setState({tagAddress: value})
  }

  handleWhenChange(value) {
    let val = value.detail.value;
    this.setState({startDate: val})
  }

  handleTimeChange(value) {

    this.setState({startTime: value.detail.value + ":00"})
  }

  handleMenChange(value) {
    this.setState({peopleCount: value})
  }

  handleContactChange(value) {
    this.setState({userName: value})
  }

  handlePhoneChange(value) {
    this.setState({mobile: value})
  }

  handleMemoChange(event) {
    this.setState({intro: event.target.value})
  }


  handleAgree() {
    let flag = this.state.agree
    if (this.releaseTimes == 0) {
      this.setState({agree: !flag, submit: true})
      return
    }
    this.setState({agree: !flag, submit: flag})
  }

  handleShowProtocol() {
    Taro.navigateTo({
      url:'/pages/protocol/ridingProtocol'
    })
  }

  commitParamsCheck(){
    let checked = false;
    let hint = '';
    if (!this.state.startAddress){
      hint = '请填写出发地'
    } else if (!this.state.tagAddress){
      hint = '请填写目的地'
    } else if (!this.state.startDate){
      hint = '请选择出发日期'
    }  else if (!this.state.startTime){
      hint = '请选择出发时间'
    }else if (!this.state.peopleCount){
      hint = '请填写可乘人数'
    } else if (!this.state.userName){
      hint = '请填写联系人'
    } else if (!this.state.mobile){
      hint = '请填写您的手机号'
    } else {
      checked = true;
    }
    if (!checked){
      Taro.showToast({
        title:hint,
        icon:'none'
      })
    }

    return checked;
  }

  handleOnSubmit(e) {

    if (!isCommitEnable){
      return;
    }

    if (!this.commitParamsCheck()){
      return;
    }

    isCommitEnable = false;

    let data = {
      platform: 'android_c',
      loginChannel: 'c',
      userName: this.state.userName,
      mobile: this.state.mobile,
      startDate: this.state.startDate + " " + this.state.startTime,
      peopleCount: this.state.peopleCount,
      type: this.type,
      startAddress: this.state.startAddress,
      tagAddress: this.state.tagAddress,
      intro: this.state.intro

    };
    Object.assign(data, this.auth);

    // http.post('rest/car/applyCar',{},'application/json')
    Taro.request({
      url: 'https://www.vpin.top/a/rest/car/applyCar',
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: 'POST',
      dataType: 'json',
      data: data,
      success: (obj) => {
        if (obj.data.status == 'fail') {
          Taro.showToast({
            title: '发布失败',
            icon: 'none',
            duration: 1000
          })
        } else {
          Taro.showToast({
            title: '发布成功',
            icon: 'success',
            duration: 1000
          })
          Taro.eventCenter.trigger('ridingPost' ,[]);
          Taro.navigateBack({delta: 1});
        }
        isCommitEnable = true;
      },
      fail: (obj) => {
        Taro.showToast({
          title: '程序异常',
          icon: 'none',
          duration: 1000
        })
        isCommitEnable = true;
      }
    })


  }


  render() {

    let nowDate = new Date()
    let start = nowDate.getFullYear() + '-' + nowDate.getMonth() + "-" + nowDate.getDay()

    let startDateShow = this.state.startDate ? this.state.startDate : '点击选择出发日期';
    let startTimeShow = this.state.startTime ? this.state.startTime : '点击选择出发时间';

    let dateTextStyle = this.state.startDate ? 'date-input-text' : 'date-input-text-hint';
    let timeTextStyle = this.state.startTime ? 'date-input-text' : 'date-input-text-hint';

    return (

      <View>


        <View style='padding:0px 5px'>

          <AtInput
            name='from'
            className='common-input'
            value={this.state.startAddress}
            clear
            title='出发地'
            type='text'
            placeholder='请填写出发地'
            border
            maxlength={50}
            onChange={this.handleFromChange.bind(this)}/>

          <AtInput
            name='to'
            className='common-input'
            value={this.state.tagAddress}
            clear
            border
            title='目的地'
            type='text'
            placeholder='请填写目的地'
            maxlength={50}
            onChange={this.handleToChange.bind(this)}/>

          <View>
            <Picker mode='date' value='YYYY-MM-DD' start={start} onChange={this.handleWhenChange.bind(this)}>
              <View className='date-input-container'>
                <Text className='date-input-text'>出发日期</Text>
                <Text className={dateTextStyle}>{startDateShow}</Text>
              </View>
            </Picker>
          </View>

          <View className='date-divider'></View>

          <View>
            <Picker mode='time' onChange={this.handleTimeChange.bind(this)}>
              <View className='date-input-container'>
                <Text className='date-input-text'>出发时间</Text>
                <Text className={timeTextStyle}>{startTimeShow}</Text>
              </View>
            </Picker>
          </View>

          <View className='date-divider'></View>
          <AtInput
            className='common-input'
            name='men'
            clear
            border
            title='可乘人数'
            value={this.state.peopleCount}
            type='number'
            placeholder='请填写可乘人数'
            onChange={this.handleMenChange.bind(this)} />
          <AtInput
            className='common-input'
            name='contact'
            value={this.state.userName}
            clear
            border
            title='联系人'
            type='text'
            maxlength='10'
            placeholder='请填写联系人'
            onChange={this.handleContactChange.bind(this)} />
          <AtInput
            className='common-input'
            name='phone'
            value={this.state.mobile}
            clear
            border
            title='手机号'
            type='phone'
            placeholder='请输入您的手机号'
            onChange={this.handlePhoneChange.bind(this)}
          />

          <View className='memo'>备注</View>

          <View style='margin-bottom:2px'>
            <AtTextarea value={this.state.intro} onChange={this.handleMemoChange.bind(this)} placeholder='' maxlength='100' />
          </View>
        </View>

        <View className='disclaimer'>
          <CustomRadio checked={this.state.agree} onClick={this.handleAgree.bind(this)} />
          <View className='protocol-ele' onClick={this.handleShowProtocol.bind(this)}>我已阅读并同意《拼车平台声明》</View>
        </View>

        <View className='post-section'>
          <Button className='btn-post'  disabled={this.state.submit} onClick={this.handleOnSubmit.bind(this)}>{this.state.btnText}</Button>
        </View>

      </View>

    )

  }

}
